<template>
   <div class="m-footer border-top-1px">
       <div class="item" @click="callMe">
           <i class="icon-kf_tabbar_phone"></i><span>电话客服</span>
       </div><div class="item" @click="toChat">
           <i class="icon-kf_tabbar_secretary"></i><span>客服小秘书</span>
       </div>
   </div>
</template>
<script>
    export default {
        name: 'chat',
        data() {
            return {
            };
        },
        methods: {
            toChat() {
                this.$router.push({name: 'Chat', query: { title: '客服小秘书' }})
            },
            callMe() {
               //电话客服
            }
        }
    };
</script>
<style lang="scss" type="text/scss" scoped>
    @import "./../scss/mixin";
    @import "./../scss/variables";
    .m-footer {
        text-align: center;
        font-size: 0;
        height: px2rem(100);
        padding: px2rem(22) 0;
        .item {
            position: relative;
            z-index: 50;
            display: inline-block;
            line-height: px2rem(54);
            width: 50%;
            font-size: px2rem(28);
            color: $f-colorA;
            &:nth-child(1) {
                @include border-1px($bl-colorA, right, solid, 0);
            }
            i {
                font-size: px2rem(52);
                position: relative;
                top: px2rem(10);
            }
            span {
                display: inline-block;
                margin-left: px2rem(10);
            }
        }
    }
</style>
